<template>
  <div >
  <el-container>
  <el-header>
     <div id="header_left">
    特征筛选平台
    </div>
    <div id="header_right">
      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="1" > 首页</el-menu-item>

      <el-menu-item index="2" >我的提交</el-menu-item>
        <!-- <el-menu-item index="3" >成员介绍</el-menu-item>
        <el-menu-item index="4" >项目demo</el-menu-item>
        <el-menu-item index="5" >实用工具</el-menu-item>-->
      <el-menu-item index="6">登陆</el-menu-item>
      <el-menu-item index="7">管理员登陆</el-menu-item>
      </el-menu>
    </div>
    <div class="line"></div>

  </el-header>
  <el-divider></el-divider>
  <el-main>
<!--    <div style=" width :50%;margin: auto;">-->
<!--      <el-upload  class="upload-demo"-->
<!--                  drag-->
<!--                  :on-change="handleChange"-->
<!--                  action="http://jsonplaceholder.typicode.com/posts/"-->
<!--                  multiple>-->
<!--        <i class="el-icon-upload"></i>-->
<!--        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>-->
<!--        <div class="el-upload__tip" slot="tip">只能上传.csv文件，且不超过5mb，要求数据最后一列为标签列</div>-->
<!--      </el-upload>-->
<!--    </div>-->
    <!-- <index /> -->
<!--    <router-view/>-->
    <el-table
      :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
      style="width: 100%">
      <el-table-column
        label="提交日期"
        prop="date">
      </el-table-column>
      <el-table-column
        label="数据集名称"
        prop="name">
      </el-table-column>
      <el-table-column
        label="准确率"
        prop="acc">
      </el-table-column>
      <el-table-column
        label="特征重要性排名"
        prop="rank">
      </el-table-column>

    </el-table>

  </el-main>
  <el-footer>

     <div id="copyright">
      Copyright ©️ 2022 cch. All Rights Reserved
    </div>


  </el-footer>
</el-container>

  </div>

</template>

<style scoped>

#header_left{
  float: left;
   color:cornflowerblue;
  font-size: 25px;
  font-weight: 800;
  text-transform: uppercase;/*大写*/
  position: absolute;
  top: 3%;
  left:15%;
}
#header_right{
  float: left;
  padding-left: 50%;

  /* left:45%; */

}

/* .el-menu{
  left: 45%;

} */
.el-menu-item {
   font-size: 18px;
}
#copyright{

  position: absolute;
  top: 95%;
  left: 38%;

}
</style>

<script>
import index from '@/components/index.vue'
  export default {
    data() {
      return {
        activeIndex: '1',
        activeIndex2: '1',
        tableData: [{
          date: '2023-06-10',
          name: 'ccc',
          acc: '97.10',
          rank: '2, 0, 1'
        }],
        search: ''
      };
    },
    methods: {
      handleEdit(index, row) {
        console.log(index, row);
      },
      handleDelete(index, row) {
        console.log(index, row);
      },
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
        if(key==1){
          this.$router.push("/userindex")
        }else if(key==2){
          this.$router.push("/submit")
        }else if(key==3){
          this.$router.push("/members")
        }else if(key==4){
          this.$router.push("/project")
        }else if(key==5){
          this.$router.push("/util")
        }else if(key==6){
          this.$router.push("/userlogin")
        }else if(key==7){
          this.$router.push("/login")
        }
      },
      handleChange(file, fileLists) {
        console.log(fileLists);
        this.$axios({
          url: "http://localhost:8081/",
          method: "get",
          params:{
            "name":fileLists[0].name,
          }        })
          .then((res) => {
            if(res.data.flag==true){
            }
            // router.push('./adminhome')
          })
          .catch((err) => {
            console.log(err);
          });
        this.timer = setTimeout(()=>{   //设置延迟执行
          console.log('ok');
          // this.$router.push("/project")
        },15000);
      },
    },

    components: {

    index
  }
  }

</script>
